<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>微博</title>
	<script src="lib/react.development.js"></script>
	<script src="lib/react-dom.development.js"></script>
	<script src="lib/babel.min.js"></script>
	<link href="style/weibo.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="jyArea">

</div>

</body>
<script type="text/babel">
	const root = ReactDOM.createRoot(document.querySelector(".jyArea"));
	// jsx 即是对元素标签的一种扩展。
	class App extends React.Component{
		render(){
			return (
				<>
					<div className="takeComment">
						<textarea name="textarea" className="takeTextField" id="tijiaoText"></textarea>
						<div className="takeSbmComment">
							<input type="button" className="inputs" value=""/>
						</div>
					</div>
					
					
					<div className="commentOn">
						<div className="noContent">暂无留言</div>
						<div className="messList">
							<div className="reply">
								<p className="replyContent">内容</p>
								<p className="operation">
									<span className="replyTime">2020.03.10 01:01:01</span>
									<span className="handle">
                    	<a href="javascript:;" className="top">0</a>
                        <a href="javascript:;" className="down_icon">9</a>
                        <a href="javascript:;" className="cut">删除</a>
                    </span>
								</p>
							</div>
						</div>
						<div className="page">
							<a href="javascript:;" className="active">1</a>
							<a href="javascript:;">2</a>
							<a href="javascript:;">3</a>
						</div>
					</div>
				</>
			)
		}
	}
	
	root.render(<App/>);
</script>
</html>
